<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>媒体查询引入外部CSS</title>
    <!-- 检测视口宽度大于1200px的时候，背景颜色设置为红色 -->
    <link rel="stylesheet" media="(min-width: 1200px)" href="./css/red.css">
    <!-- 检测视口宽度小于768px的时候，背景颜色设置为蓝色 -->
    <link rel="stylesheet" media="(max-width: 768px)" href="./css/blue.css">
</head>
<body>

</body>
</html>
